<template>
  <div>
    <el-dialog :visible.sync="show" title="添加巡查计划" center>
      <div style="margin-left: 50px">
        <p>计划名称 <span style="color: #ce0e0f">*</span>：
          <span style="display: block"><el-input size="small" style="width: 50%;margin: 10px 0"
                                                 placeholder="请输入计划名称" v-model="data.autoPatrolName"></el-input></span>
        </p>
        <p>巡查时间 <span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-date-picker
              size="small"
              style="margin: 10px 0;width:50%;"
              v-model="dateFn"
              type="daterange"
              clearable
              @change="getDate"
              :picker-options="pickerOptions"
              format-value="yyyy-MMMM-dd"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期">
          </el-date-picker></span>
        </p>
        <p>模板名称<span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-select size="small" v-model="data.patrolTemplateId"
                                                   style="width: 50%;margin-top: 10px"
                                                   filterable placeholder="请选择模板名称">
            <el-option v-for="item in templateList" :label="item.templateName" :value="item.templateId"
                       :key="item.templateId"></el-option>
          </el-select></span>
        </p>
        <p style="margin-top: 10px">巡查方式<span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-radio v-model="data.patrolWay" label='1'
                                                  style="margin-top: 10px">线上考评</el-radio></span>
        </p>
        <p style="margin-top: 15px">任务时效 <span style="color: #ce0e0f">*</span>：
          <span style="display: block"><el-input size="small" style="width: 50%;margin: 10px 0"
                                                 placeholder="请输入天数" v-model="data.taskTime"></el-input></span>
        </p>
        <p style="margin-top: 10px">提醒时间 <span style="color: #ce0e0f">*</span>：
          <span style="display: block">
          <el-date-picker
              size="small"
              style="width: 50%;margin: 10px 0"
              v-model="data.taskRemindTime"
              type="date"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions"
              placeholder="选择日期"></el-date-picker>
          </span>
        </p>
        <p>巡查人<span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-select size="small" v-model="data.inspectorId"
                                                   style="width: 50%;margin: 10px 0"
                                                   filterable placeholder="请选择巡查人">
            <el-option v-for="item in userList" :label="item.userName" :value="item.userId"
                       :key="item.userId"></el-option>
          </el-select></span>
        </p>
        <p>巡查门店<span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-select size="small" v-model="data.assignTaskIds"
                                                   style="width: 50%;margin-top: 10px"
                                                   filterable placeholder="请选择巡查门店" multiple>
            <el-option v-for="item in assignTaskIdList" :label="item.assignName" :value="item.assignTaskId"
                       :key="item.assignTaskId"></el-option>
          </el-select></span>
        </p>
        <p>审核人<span style="color: #ce0e0f">*</span>：
          <span style="display: block"> <el-select size="small" v-model="data.auditId"
                                                   style="width: 50%;margin-top: 10px"
                                                   filterable placeholder="请选择审核人">
            <el-option v-for="item in userList" :label="item.userName" :value="item.userId"
                       :key="item.userId"></el-option>
          </el-select></span>
        </p>
      </div>
      <span slot="footer">
        <el-button @click="_submit" style="background-color:#303e9d;color: #eee" size="small">提 交</el-button>
        <el-button @click="show=false" size="small">取 消</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import dayjs from "dayjs";

export default {
  name: "configurationAdd",
  data() {
    return {
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 24 * 60 * 60 * 1000
        }
      },
      show: false,
      autoPatrolName: "",
      auditId: "",
      inspectorId: "",
      assignTaskIds: "",
      taskRemindTime: "",
      dateFn: "",
      patrolWay: '1',
      templateIds: "",
      patrolTemplateId: [],
      assignTaskIdList: [],
      data: {
        patrolWay: "1"
      },
      templateList: [],
      userList: [],
    }
  },
  methods: {
    handleOpen() {
      this.show = true
      this.data = this.$options.data().data
      this.dateFn = ""
      const params = {
        pageSize: 1000,
        pageNumber: 1,
        state: 1
      }
      this.$api.patrolGetPatrolTemplateVo(params).then(res => {
        this.templateList = res.data
      })
      this.$api.patrolGetPatrolStoreVo(params).then(res => {
        this.assignTaskIdList = res.data
      })
      this.$api.inspectionTaskGetAllPatrolPerson().then(res => {
        this.userList = res
      })
    },
    getDate(val) {
      if (val) {
        this.data.startTime = dayjs(val[0]).format("YYYY-MM-DD");
        this.data.endTime = dayjs(val[1]).format("YYYY-MM-DD");
      } else {
        this.data.startTime = ''
        this.data.endTime = ''
      }
    },
    _submit() {
      const data = this.data
      this.$api.inspectionTaskAddAutoPatrolConfig(data).then(res => {
        if (res == 1) {
          this.$message.success('添加成功！')
          this.$emit('addStatus', 1);
          this.show = false
        }
      })
    }
  }
}
</script>
<style scoped lang="less">


</style>